const launchFullScreen = (element) => {
    if(element.requestFullscreen) {
        element.requestFullscreen();
    } else if(element.mozRequestFullscreen) {
        element.mozRequestFullScreen();
    } else if(element.webkitRequestFullscreen) {
        element.webkitRequestFullscreen();
    } else if(element.msRequestFullscreen) {
        element.msRequestFullscreen();
    }
}

// 启动全屏!
launchFullScreen(document.documentElement); // 整个网页
launchFullScreen(document.getElementById("videoElement")); // 某个页面元素

function exitFullscreen() {
  if(document.exitFullscreen) {
    document.exitFullscreen();
  } else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if(document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  }
}
// 退出全屏
exitFullscreen();

/**
 * document.fullScreenElement: 全屏显示的网页元素。
 * document.fullScreenEnabled: 判断当前是否处于全屏状态。
 * fullscreenchange事件会在启动全屏或退出全屏时触发：
 */
var fullscreenElement = document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement;
var fullscreenEnabled = document.fullscreenEnabled || document.mozFullScreenEnabled || document.webkitFullscreenEnabled;

// :-webkit-full-screen {
//     /* properties */
//   }
   
//   :-moz-full-screen {
//     /* properties */
//   }
   
//   :-ms-fullscreen {
//     /* properties */
//   }
   
//   :full-screen { /*pre-spec */
//     /* properties */
//   }
   
//   :fullscreen { /* spec */
//     /* properties */
//   }
   
//   /* deeper elements */
//   :-webkit-full-screen video {
//     width: 100%;
//     height: 100%;
//   }
   
//   /* styling the backdrop*/
//   ::backdrop {
//     /* properties */
//   }
//   ::-ms-backdrop {
//     /* properties */
//   }